// 此模块定义组合式函数
import { unref,ref, onMounted, onUnmounted, reactive,watchEffect,isRef, onUpdated } from 'vue';
import axios from "axios";


// 需求：鼠标在页面上移动，得到鼠标当前的位置（x,y);
export function usePostion() {

    let x = ref(0);
    let y = ref(0);


    function updateXAndY(event) {
        x.value = event.pageX;
        y.value = event.pageY;
    }

    useEvent(updateXAndY);

    return { x, y };
}

export function useEvent(updateXAndY) {
    onMounted(() => {
        window.addEventListener("mousemove", updateXAndY)
    })

    // 组件卸载完毕后，删除事件
    onUnmounted(() => {
        window.removeEventListener("mousemove", updateXAndY)
    })
}

// 需求：获取数据
// 参数：url是请求地址（可以是响应式的ref对象，也可以是普通字符串。
// export function useGetData(url){
//     console.log("useGetData",useGetData);
//     let data = reactive([]);
//     let err = reactive(null);

//     if(isRef(url)){
//         watchEffect(()=>{
//             axios({
//                 url:unref(url)
//             }).then(res=>{
//                 if(res.data.code==="200"){
//                     console.log("后端响应回来了");
//                     data.splice(0,data.length,...res.data.data);
//                 }
//             }).catch(err=>{
//                 err.value = err;
//             })    
//         })
//     }else{

//     }    
//     return {data,err};   

// }

export function useGetData(url,params){
    console.log("useGetData",useGetData);
    let data = reactive([]);
    let err = reactive(null);


    function getData(){
        axios({
                url:unref(url),//unref:如果是响应式对象，那么 用 .value，如果不是响应式对象，直接使用。
                params:unref(params)
            }).then(res=>{
                if(res.data.code==="200"){
                    console.log("后端响应回来了");
                    data.splice(0,data.length,...res.data.data);
                }
            }).catch(err=>{
                err.value = err;
            })    
    }

    if(isRef(url) || isRef(params)){
        watchEffect(()=>{
            getData();
        })
    }else{
        getData();
    }    
    return {data,err};   

}


function useFn(a){

    onUpdated(()=>{

    });

}